<template>
	<view class="">
		<view class="bg-white p-10">
			<view class="hede-title banmi_flex a-c">
				<view class="c-text">
					App升级
				</view>
			</view>
			<view class="p-10 f-w-800 f-14 hede-title ">
				框架内置各平台编辑功能,app应用，用到添加更新 <text class="cred">(新增版本一定要比以前的版本更高,不能有已有1.0.5.105，新增一个1.0.5.104)</text>
			</view>
			<view id="bm_top_height" class="bg-white p-10  a-c" style="flex-wrap: wrap;display: flex;">
				<view class="banmi_flex">
					<view style="padding: 0 7rpx;"> <button @click="on_add()" type="primary" size="mini"> 新增 </button>
					</view>
				</view>
			</view>

			<uni-table v-if="is_top_height" border stripe @selection-change="selectionData">
				<uni-tr style=" position:sticky;top: 0;">
					<uni-th align="center">id</uni-th>
					<uni-th align="center">更新内容</uni-th>
					<uni-th align="center">下载地址</uni-th>
					<uni-th align="center">是否强制</uni-th>
					<uni-th align="center">升级方法</uni-th>
					<uni-th align="center">是否发行</uni-th>
					<uni-th align="center">版本号</uni-th>
					<uni-th align="center">版本名称</uni-th>
					<uni-th align="center">静默更新</uni-th>
					<uni-th align="center">设备平台</uni-th>
					<uni-th align="center">创建时间</uni-th>
					<uni-th align="center" class="operate_right">操作</uni-th>
				</uni-tr>
				<uni-tr v-for="(vo,index) in list" :key="index">
					<uni-td align="center">
						{{vo.id}}
					</uni-td>
					<uni-td>
						<rich-text :nodes="vo.describe"></rich-text>
					</uni-td>
					<uni-td align="center">
						{{vo.edition_url}}
					</uni-td>
					<uni-td align="center">
						{{vo.edition_force==0?'否':'是'}}
					</uni-td>
					<uni-td align="center">
						{{vo.package_type==0?'整包':'wgt热更新'}}
					</uni-td>
					<uni-td align="center">
						{{vo.edition_issue==0?'否':'是'}}
					</uni-td>
					<uni-td align="center">
						{{vo.edition_number}}
					</uni-td>
					<uni-td align="center">
						{{vo.edition_name}}
					</uni-td>
					<uni-td align="center">
						{{vo.edition_silence==0?'否':'是'}}
					</uni-td>
					<uni-td align="center">
						{{vo.device}}
					</uni-td>
					<uni-td align="center">
						{{vo.create_time|getTime}}
					</uni-td>
					<uni-td class="operate_right" buts="buts">
						<view class="t-c">
							<button @click="on_edit(index)" class="operate_button" type="primary" size="mini">
								编辑
							</button>
						</view>
						<view class="t-c">
							<button @click="on_dels(index)" class="operate_button button_del" type="primary"
								size="mini">删除</button>
						</view>
					</uni-td>
				</uni-tr>
			</uni-table>


			<view class="p-20" style="height: 60rpx;">
				<uni-pagination @change="getPage" show-icon="true" :total="total" current="1"
					style="float: left;"></uni-pagination>
			</view>

			<edit ref="component_edit" @confirm="confirm_edit">
			</edit>
			<uni-popup ref="component_dels" type="center">
				<dels :id="id" @confirm="confirm_dels">
				</dels>
			</uni-popup>

		</view>
	</view>
</template>

<script>
	import edit from './edit.vue';
	import dels from './dels.vue';

	export default {
		components: {
			edit,
			dels,
		},
		data() {
			return {


				find: {},
				list: [],
				total: 0,
				page: 1,
				id: 0,
				is_top_height: false,
			}
		},
		onLoad(on) {

			var menu_list = uni.getStorageSync('menu_list');
			for (var i = 0; i < menu_list.length; i++) {
				if (menu_list[i]['menu_id'] == on.id) {
					this.plugin_catalogue = menu_list[i]['plugin_catalogue']
					this.plugin_id = menu_list[i]['plugin_id']
				}
			}

			this.init();
		},
		created() {
			let that = this
			setTimeout(function() {
				let element = document.getElementById("bm_top_height");
				that.top_height = element.offsetHeight;
				that.is_top_height = true;
			}, 200);
		},
		methods: {
			//全选 反选
			selectionData(list) {
				console.log("list: " + JSON.stringify(list));
			},

			on_edit(index) {
				this.id = this.list[index]['id'];
				this.$refs.component_edit.init(this.id, this.plugin_catalogue)
			},
			confirm_edit() {
				if (this.id == 0) {
					this.page = 1;
				}
				this.init();

			},
			on_dels(index) {
				this.id = this.list[index]['id'];
				this.$refs.component_dels.open()
			},
			confirm_dels() {
				this.init();
				this.$refs.component_dels.close()
			},
			getPage(id) {
				this.page = id.current;
				this.init()
			},
			on_add() {
				this.id = 0;
				this.$refs.component_edit.init(0, this.plugin_catalogue)
			},
			on_search() {
				this.init();
			},
			on_search_resetting() {
				this.find = {};
				this.page = 1;
				this.init();
			},
			async init() {
				var that = this;
				this.find['page'] = this.page
				this.find['catalogue'] = this.plugin_catalogue;
				const ret = await this.Banmikeji.Appup_lists(this.find);
				var list = ret.data.list.list.data;
				this.list = list;
				this.total = ret.data.list.list.total;
			},
		}
	}
</script>

<style>
	.operate_button {
		width: 70px;
	}

	.operate_right {
		position: sticky;
		right: 0;
		z-index: 100;
		background-color: #fff;
	}

	.button_del {
		background-color: #ccc!important;
	}
</style>